import React, { Component } from 'react';
import { pageInfo } from './pageStore'
import './page.css'
class Page extends Component {
    render() {
        const renderList = pageInfo.pageList;
        const {scroll,height}=this.props;
        return (
            <>
                {renderList.map((Item, index) => {
                    let percent=0;
                    if(scroll>height*index||scroll<height*(index+1)){
                        percent=Math.ceil((1-((height*index-scroll)/height))*100);
                        if(percent>200) percent=200;
                        if(percent<0) percent=0;
                    }
                    return <Item page={index} percent={percent} key={index}/>
                })}
            </>
        );
    }
}

export default Page;
